<template>
	<!-- 常用报销单位列表页 -->
	<view class="page expense-units-page show">
		<view class="page-content">
			<view @click="navigateToSelectDept" class="add-unit-btn">
				<u-icon name="plus" color="#165DFF" size="15"></u-icon>
				<text>新增报销单位</text>
			</view>

			<view class="units-list">
				<scroll-view style="height:calc(100vh - 260rpx)" scroll-y
					:scroll-with-animation="true">
				<view class="unit-item" v-for="(unit, index) in units" :key="index">
					<view class="unit-header">
						<view>
							<text class="unit-name">{{ unit.agencyName }}</text>
							<text class="unit-location">{{ unit.areaName }}</text>
						</view>
						<text class="default-tag" v-if="unit.isDefault">默认</text>
					</view>

					<view class="unit-actions">
						<view class="action-btn set-default" @click="setDefault(index)">
							<u-icon name="checkmark-circle" color="#165DFF" size="15"></u-icon>设为默认
						</view>
						<view class="action-btn delete" @click="deleteUnit(index)">
							<u-icon name="trash" color="#F53F3F" size="15"></u-icon>删除
						</view>
					</view>
				</view>
				</scroll-view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		addCommonAddress,
		deleteCommonAddress,
		getUserCommonAddress,
		defaultCommonAddress
	} from '@/api/profileApi.js'
	export default {
		data() {
			return {
				units: [],
				userInfo:{},
			}
		},
		created() {
			console.log('用户信息', uni.getStorageSync('userInfo'))
			this.userInfo = uni.getStorageSync('userInfo')
		},
		onShow() {
			console.log('onshow')
			this.getUserCommonAddressFun()
		},
		methods: {
			navigateToSelectDept() {
				uni.navigateTo({
					url: '/pages/home/reimbursementUnit',
					success: () => {
						uni.$emit('pageName', 'expenseUnitsPage')
					}
				});
			},
			async getUserCommonAddressFun() {
				uni.showLoading({
					title: '加载中'
				})
				const res = await getUserCommonAddress()
				if (res.result == 0) {
					uni.hideLoading()
					this.units = res.unitList
				} else {
					uni.hideLoading()
					this.$u.toast(res.message || '接口错误');
				}
			},
			
			async setDefault(index) {
				uni.showLoading({
					title: '操作中'
				})
				const res = await defaultCommonAddress({
					id: this.units[index].id,
				})
				console.log('res', res)
				if (res.result == 0) {
					uni.hideLoading()
					this.$u.toast(`已将${this.units[index].agencyName}设为默认`);
					uni.setStorage({
						key: 'userInfo',
						data: {...this.userInfo,
						unitDefault:this.units[index]}
					})
					this.getUserCommonAddressFun()
				} else {
					uni.hideLoading()
					this.$u.toast(res.message || '接口错误');
				}
			},
			deleteUnit(index) {
				const unit = this.units[index];
				uni.showModal({
					title: '确认删除',
					content: `确定要删除 ${unit.agencyName} 吗？`,
					success: (res) => {
						if (res.confirm) {
							console.log('用户点击确定');
							this.deleteCommonAddressFun(unit.id)
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			},
			async deleteCommonAddressFun(id) {
				uni.showLoading({
					title: '删除中'
				})
				const res = await deleteCommonAddress({
					id,
				})
				console.log('res', res)
				if (res.result == 0) {
					uni.hideLoading()
					this.$u.toast(res.message || '删除成功');
					this.getUserCommonAddressFun()
				} else {
					uni.hideLoading()
					this.$u.toast(res.message || '接口错误');
				}
			}
		}
	};
</script>

<style>
	@import 'index.css'
</style>